@extends('welcome')
<link rel="stylesheet" href="/Home/User/css/safe/ms-style.min.css" />
<link rel="stylesheet" href="/Home/User/css/safe/personal_member.min.css" />
<link rel="stylesheet" href="/Home/User/css/safe/Snaddress.min.css" />
<link rel="stylesheet" href="/Home/login/css/landreg.css" />
<!-- 表格样式 -->
<link rel="stylesheet" href="/Home/address/css.css" />
<link rel="stylesheet" href="/Home/address/sui.css" />
<link rel="stylesheet" href="/Home/address/common.min.css" />
<!--导入地区联动插件-->
<script type="text/javascript" src="/Home/UserEdit/jquery.js"></script>
<script type="text/javascript" src="/Home/UserEdit/area.js"></script>
<script type="text/javascript" src="/Home/UserEdit/location.js"></script>
@section('titletitle','地址管理--优品惠')
@section('zhong_content')
  <br/>
  <!-- 用户中心开始 -->
  <div id="ms-center" class="personal-member">
    <div class="cont">
      <div class="cont-side">
        <div class="side-neck">
          <i></i>
        </div>
        <div class="ms-side">
          <article class="side-menu side-menu-off">
            <dl class="side-menu-tree">
              <dt>订单管理</dt>
              <dd><a  href="{{url('/home/order/xiangqing')}}" target="_self"><span class="active"></span>订单中心</a></dd>
            </dl>
            <dl class="side-menu-tree">
              <dt>账户管理</dt>
              <dd><a href="{{url('home/user/edit')}}" target="_self"><span class="active"></span>我的资料</a></dd>
              <dd><a href="{{url('home/user/password')}}" target="_self"><span class="active"></span>密码修改</a></dd>
              <dd><a href="{{url('home/user/address')}}" target="_self" style="color:#f70"><span></span>地址管理</a></dd>
            </dl>
            <dl class="side-menu-tree">
              <dt>收藏管理</dt>
              <dd><a href="{{url('home/collect/index')}}" target="_self"><span class="active"></span>收藏列表</a></dd>
            </dl>
            <a ison="on" class="switch-side-menu icon-up-side"><i></i></a>
          </article>
        </div>
      </div>
      <div class="cont-main">
        <div class="main-wrap mt15">
        @if(session('error'))
          {{session('error')}}
        @endif

        @if (count($errors) > 0)
          <div class="">
            <ul>
              @foreach ($errors->all() as $error)
                <div class="cont-main alert alert-danger alert-dismissable" style="width:400px">
                  <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
                  <li>{{ $error }}</li>
                </div>
              @endforeach
            </ul>
          </div>
        @endif

        @if(session('success'))
        <div class="cont-main alert alert-success alert-dismissable" style="width:400px">
          <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
            <h5> {{session('success')}} </h5>
        </div>
        @endif
        @if(session('error'))
        <div class="cont-main alert alert-danger alert-dismissable" style="width:400px">
           <h5> {{session('error')}} </h5>
        </div>
        @endif
        <!-- 收货地址管理开始 -->
          <h3><strong style=" font-size: 14px;">收货地址</strong></h3>
          <div class="user-profile clearfix" style="margin-left: 0px;width: 100%;border: 0px;">
            <form action="/home/user/addinsert" method="get">
              <div class="user-profile-wrap" style="width: 100%;height: 350px;">
                <p style="margin-left: 70px;font-size: 14px;">
                  <span style="color:#F88600;font-size: 14px;">新增收货地址</span>
                  <span style="margin-left: 10px;font-size: 14px;font-weight: bold;">请准确填写,方便寄送</span> 
                </p>
                <div style="margin-left: 35px;margin-top: 50px;">
                  <span style="color: #F2873B;">*&nbsp;</span><span class="titles">所在地区详细地址:</span>
                </div>
                <div style="margin-left: 150px">
                  <select id="loc_province" class="" name="sheng" style="width:80px;"></select>
                  <select id="loc_city" class="" name="shi" style="width:100px;"></select>
                  <select id="loc_town" class="" name="xian" style="width:120px;"></select>
                  <br><br>
                  <input name="content" placeholder="所在地区详细地址" style="padding: 5px;width: 300px;margin-left: 14px;" type="text">                </div>
                <div style="margin-left: 80px;margin-top: 20px;">
                  <span class="titles">邮政编号:</span>
                  <input name="postcode" placeholder="如您不清楚地区邮递号，请填写000000" style="padding: 5px;width: 300px;margin-left: 14px;" type="text">
                </div>
                <div style="margin-left: 55px;margin-top: 30px;">
                  <span style="color: #F2873B;">*</span>
                  <span class="titles">收货人姓名:</span>
                  <input name="dizhi_name" placeholder="长度不超过25个字符" style="padding: 5px;width: 300px;margin-left: 14px;" type="text">
                </div>
                <div style="margin-left: 80px;margin-top: 30px;">
                  <span class="titles">手机号码:</span>
                  <select style="padding: 5px;margin-left: 14px;">
                    <option>中国大陆+86</option>
                  </select>
                  <input name="phone" placeholder="请填写正确的手机号码" style="padding: 5px;width: 200px;" type="text">
                </div>
                <div style="margin-left: 55px;margin-top: 30px;">
                  <input name="statuss" value="2" style="padding: 5px" type="checkbox">
                  <span style="color: #F2873B;">*</span>
                  <span class="titles">设为默认地址:</span>
                </div>
                <button style="margin-left:150px;margin-top:10px;background-color:#F37B1D ;color: #fff;width: 100px;height: 30px;border: 0px;border-radius: 5px;">确定</button>
              </div>
            </form>
          </div>
        <!-- 收货地址管理结束 -->
        </div>
      </div>
      <!-- 收货地址列表开始 -->
      <div style="margin-top: 30px;width: 1068px; margin: 15px 0 30px 170px;">
        <dl style="color: #F88600;font-size: 16px;margin-top: 69px;">最多保留10个有效地址</dl>
        <table class="sui-table table-bordered-simple" style="margin-top: 20px;">
          <thead>
            <tr>
              <th>编号</th>
              <th>收货人</th>
              <th>收货地址</th>
              <th>邮编</th>
              <th>手机</th>
              <th>操作</th>
              <th></th>
            </tr>
          </thead>
          <tbody>
            @foreach($addresses as $k=>$v)
            <tr class="addresses">
              <td class="sid">{{$v->id}}</td>
              <td>{{$v->dizhi_name}}</td>
              <td><span class="add" add="{{$v->sheng}},{{$v->shi}},{{$v->xian}}"></span><span>{{$v->content}}</span></td>
              <td>{{$v->postcode}}</td>
              <td>{{$v->phone}}</td>
              <td><a href="{{url('/home/user/addressedit',['id'=>$v->id])}}" style="color: #007AFF;">修改</a>&nbsp;|&nbsp;<a href="javascript:;" style="color: #007AFF;" class="delete">删除</a></td>
              <td>@if($v->statuss == 2)<span style="padding: 2px;font-size: 10px;color: #EC5937;border-radius:5px;background-color: #fad5d0;border: 1px #C85E0B solid;">默认地址 </span>@endif</td>
            </tr>
            @endforeach
          </tbody>
        </table>
      </div>
      <!-- 收货地址列表结束 -->
    </div>
  </div>
  <!-- 用户中心结束 -->
@endsection
@section('myjs')
<script type="text/javascript">
//地址删除
$.ajaxSetup({
    headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
    }
});
    $('.delete').click(function(){
      var id = $(this).parents('tr').find('.sid').html();
      // alert(id);
      var dd = $(this);
      //发送ajax
      $.post('/home/user/addressdelete',{id:id},function(data){
        if(data == 1){
          dd.parents('tr').remove();
          alert('删除成功');
        }else{
          alert('删除失败');
        }
      })
      return false;
    })
    //三级联动地址
  $(document).ready(function() {
    showLocation();
    $('.addresses .add').each(function(){
      var str = $(this).attr('add');
      // alert(str);
      var info = getInfo(str);
      // alert(info);
      // console.log(info);
      $(this).html(info);
    });

    //定义获取城市信息方法
    function getInfo(str){
      // console.log(str);
      //拆分字符串
      var arr = str.split(',');
      // console.log(arr);  
      var ls  = new Location;
      var l = ls.items;
      // console.log(l['0,1,2']['5']);
      var sheng = l['0'][arr[0]];
      var shi = l['0,'+arr[0]][arr[1]];
      var xian = l['0,'+arr[0]+','+arr[1]][arr[2]];
      return sheng+shi+xian;
    }

    // //点击选中默认地址
    // $('#addresses .item').each(function(){
    //   $(this).click(function(){
    //     //
    //     $('#addresses .item').removeClass('aa');  
    //     $(this).addClass('aa');
    //     //获取当前点击的地址id
    //     var id  = $(this).attr('aid');  
    //     $('input[name=address_id]').val(id);
    //   })
    // })        
  });
  </script>
@endsection